/* code color */
.cm-s-inner .cm-keyword {
    color: #bb7fc3;
}

.cm-s-inner .cm-atom,
.cm-s-inner.cm-atom {
    color: #9088cc;
}

.cm-s-inner .cm-number {
    color: #88b2a1;
}

.cm-s-inner .cm-def {
    color: #7f7fff;
}

.cm-s-inner .cm-variable {
    color: #efefef;
}

.cm-s-inner .cm-variable-2 {
    color: #7faad4;
}

.cm-s-inner .cm-variable-3 {
    color: #7fc3aa;
}

.cm-s-inner .cm-string {
    color: #d48888;
}

.cm-s-inner .cm-property {
    color: #efefef;
}

.cm-s-inner .cm-operator {
    color: #cb8c8c;
}

.cm-s-inner .cm-comment,
.cm-s-inner.cm-comment {
    color: hsl(0, 0%, 35%);
}

.cm-s-inner .cm-string-2 {
    color: #ffaa7f;
}

.cm-s-inner .cm-meta {
    color: hsl(0, 0%, 33%);
}

.cm-s-inner .cm-qualifier {
    color: hsl(0, 0%, 33%);
}

.cm-s-inner .cm-builtin {
    color: #997fd4;
}

.cm-s-inner .cm-bracket {
    color: #ccccbb;
}

.cm-s-inner .cm-tag {
    color: #88bb7f;
}

.cm-s-inner .cm-attribute {
    color: #7f7fe5;
}

.cm-s-inner .cm-header,
.cm-s-inner.cm-header {
    color: #7f7fff;
}

.cm-s-inner .cm-quote,
.cm-s-inner.cm-quote {
    color: #7fcc7f;
}

.cm-s-inner .cm-hr,
.cm-s-inner.cm-hr {
    color: hsl(0, 0%, 60%);
}

.cm-s-inner .cm-link,
.cm-s-inner.cm-link {
    color: #7f7fe5;
}

.cm-negative {
    color: #eea1a1;
}

.cm-positive {
    color: #90cc90;
}

.cm-header,
.cm-strong {
    font-weight: 700;
}

.cm-error {
    color: #ff7f7f;
}

.cm-invalidchar {
    color: #ff7f7f;
}

.cm-constant {
    color: #42b983;
}

.cm-defined {
    color: #dac37f;
}

div.CodeMirror span.CodeMirror-matchingbracket {
    color: #7fff7f;
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
    color: #ff9090;
}
:root {
    --fg-color: #ffffff;
    --bg-color: #1f1f1f;
    --bg-trans-d: hsla(0, 0%, 0%, 20%);
    --bg-trans-l: hsla(0, 0%, 100%, 10%);
    --theme-vim-yl: #f3b37f;
    --theme-vim-gn: #41b883;
    --theme-vim-bl: #22a2c9;
    --table-bg: hsla(0, 0%, 100%, 6%);
    --table-bg-dim: hsla(0, 0%, 100%, 2%);
    --side-bar-bg-color: #343333;
    --control-text-color: #0e0808;
    --select-text-bg-color: hsl(153, 47%, 40%);
    --select-text-font-color: #fff;
    --item-hover-bg-color: #fff;
    --fence-bg: hsl(0, 0%, 10%);
}

/* cyrillic-ext */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhGq3-cXbKDO1w.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F,
        U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhPq3-cXbKDO1w.woff2') format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhHq3-cXbKDO1w.woff2') format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhIq3-cXbKDO1w.woff2') format('woff2');
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhEq3-cXbKDO1w.woff2') format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhFq3-cXbKDO1w.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
        U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Roboto Mono';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Mono'), local('RobotoMono-Regular'),
        url('vue/L0x5DF4xlVMF-BfR8bXMIjhLq3-cXbKD.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
        U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwmhduz8A.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F,
        U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwkxduz8A.woff2') format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwmxduz8A.woff2') format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwlBduz8A.woff2') format('woff2');
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwmBduz8A.woff2') format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwmRduz8A.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
        U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwlxdu.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
        U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNa7lqDY.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F,
        U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qPK7lqDY.woff2') format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNK7lqDY.woff2') format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qO67lqDY.woff2') format('woff2');
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qN67lqDY.woff2') format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNq7lqDY.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
        U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
        url('vue/6xK3dSBYKcSV-LCoeQqfX1RYOo3qOK7l.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
        U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmhduz8A.woff2') format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F,
        U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwkxduz8A.woff2') format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmxduz8A.woff2') format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwlBduz8A.woff2') format('woff2');
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmBduz8A.woff2') format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmRduz8A.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
        U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
        url('vue/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwlxdu.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
        U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212,
        U+2215, U+FEFF, U+FFFD;
}

html {
    font-size: 16px;
}

body {
    font-family: Source Sans Pro, Helvetica Neue, Arial, sans-serif !important;
    color: var(--fg-color);
    background-color: var(--bg-color);
    -webkit-font-smoothing: antialiased;
    line-height: 1.6rem;
    letter-spacing: 0;
    margin: 0;
    overflow-x: hidden;
}

#write {
    max-width: 860px;
    margin: 0 auto;
    padding: 20px 30px 40px 30px;
    padding-top: 20px;
    padding-bottom: 100px;
}

#write p {
    line-height: 1.6rem;
    word-spacing: 0.05rem;
}

#write ol li {
    padding-left: 0.5rem;
}

#write > ul:first-child,
#write > ol:first-child {
    margin-top: 30px;
}

body > *:first-child {
    margin-top: 0 !important;
}

body > *:last-child {
    margin-bottom: 0 !important;
}

a {
    color: var(--theme-vim-gn);
    font-weight: 600;
    padding: 0px 2px;
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    position: relative;
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-weight: bold;
    line-height: 1.4;
    cursor: text;
}

h1:hover a.anchor,
h2:hover a.anchor,
h3:hover a.anchor,
h4:hover a.anchor,
h5:hover a.anchor,
h6:hover a.anchor {
    text-decoration: none;
}

h1 tt,
h1 code {
    font-size: inherit;
}

h2 tt,
h2 code {
    font-size: inherit;
}

h3 tt,
h3 code {
    font-size: inherit;
}

h4 tt,
h4 code {
    font-size: inherit;
}

h5 tt,
h5 code {
    font-size: inherit;
}

h6 tt,
h6 code {
    font-size: inherit;
}

/* h2 a,
h3 a {
    color: #34495e;
} */

h3 a:before {
    content: '#';
    /* color: #42b983; */
    position: absolute;
    left: -0.7em;
    margin-top: -0.05em;
    padding-right: 0.5em;
    font-size: 1.2em;
    line-height: 1;
    font-weight: bold;
}

h1 {
    padding-bottom: 0.4rem;
    font-size: 2.2rem;
    line-height: 1.3;
}

h2 {
    font-size: 1.75rem;
    line-height: 1.225;
    margin: 35px 0px 15px 0px;
    padding-bottom: 0.5em;
    border-bottom: 2px solid hsl(0, 0%, 20%);
}

h3 {
    font-size: 1.4rem;
    line-height: 1.43;
    margin: 20px 0px 7px 0px;
}

h4 {
    font-size: 1.2rem;
}

h5 {
    font-size: 1rem;
}

h6 {
    font-size: 1rem;
    color: hsl(0, 0%, 53%);
}

p,
blockquote,
ul,
ol,
dl,
table {
    margin: 0.8em 0;
}

li > ol,
li > ul {
    margin: 0 0;
}

hr {
    height: 2px;
    padding: 0;
    margin: 16px 0;
    background-color: hsl(0, 0%, 18%);
    border: 0 none;
    overflow: hidden;
    box-sizing: content-box;
}

body > h2:first-child {
    margin-top: 0;
    padding-top: 0;
}

body > h1:first-child {
    margin-top: 0;
    padding-top: 0;
}

body > h1:first-child + h2 {
    margin-top: 0;
    padding-top: 0;
}

body > h3:first-child,
body > h4:first-child,
body > h5:first-child,
body > h6:first-child {
    margin-top: 0;
    padding-top: 0;
}

a:first-child h1,
a:first-child h2,
a:first-child h3,
a:first-child h4,
a:first-child h5,
a:first-child h6 {
    margin-top: 0;
    padding-top: 0;
}

h1 p,
h2 p,
h3 p,
h4 p,
h5 p,
h6 p {
    margin-top: 0;
}

li p.first {
    display: inline-block;
}

ul,
ol {
    padding-left: 30px;
}

ul:first-child,
ol:first-child {
    margin-top: 0;
}

ul:last-child,
ol:last-child {
    margin-bottom: 0;
}

blockquote {
    border-left: 4px solid #42b983;
    padding: 10px 0px 10px 15px;
    color: #fff;
    background-color: rgba(66, 185, 131, 0.1);
}

table {
    font-family: Roboto Mono, Source Sans Pro, Monaco, courier, monospace !important;
    font-size: 0.85rem;
    padding: 0;
    word-break: initial;
}

table tr {
    border-top: 1px solid hsl(210, 10%, 11%);
    margin: 0;
    padding: 0;
}

table tr:nth-child(2n),
thead {
    background-color: var(--table-bg);
}

table tr,
thead {
    background-color: var(--table-bg-dim);
}

table tr th {
    font-weight: bold;
    /* border: 1px solid hsl(210, 10%, 11%); */
    border: transparent;
    border-bottom: 0;
    text-align: left;
    margin: 0;
    padding: 6px 13px;
}

table tr td {
    border: 2px solid #1d1d1d;
    text-align: left;
    margin: 0;
    padding: 6px 13px;
}

table tr th:first-child,
table tr td:first-child {
    margin-top: 0;
}

table tr th:last-child,
table tr td:last-child {
    margin-bottom: 0;
}

#write strong {
    padding: 0px 1px 0 1px;
}

#write em {
    padding: 0px 5px 0 2px;
}

#write table thead th {
    /* background-color: hsl(0, 0%, 5%); */
    background-color: hsl(0, 0%, 9%);
}

#write .CodeMirror-gutters {
    border-right: none;
}

#write .md-fences {
    border: 1px solid hsl(0, 0%, 11%);
    -webkit-font-smoothing: initial;
    margin: 0.8rem 0 !important;
    padding: 0.3rem 0rem !important;
    line-height: 1.43rem;
    color: hsl(0, 0%, 78%);
    background-color: var(--fence-bg) !important;
    border-radius: 2px;
    font-family: Roboto Mono, Source Sans Pro, Monaco, courier, monospace !important;
    font-weight: bold;
    font-size: 0.85rem;
    word-wrap: normal;
}

#write .CodeMirror-wrap .CodeMirror-code pre {
    padding-left: 12px;
}

#write code,
tt {
    margin: 0 2px;
    padding: 2px 4px;
    border-radius: 2px;
    font-family: Roboto Mono, Source Sans Pro, Monaco, courier, monospace !important;
    font-weight: bold;
    font-size: 0.85rem;
    color: var(--theme-vim-yl);
    background-color: var(--bg-trans-d);
}

#write .md-footnote {
    color: var(--theme-vim-yl);
    background-color: var(--bg-trans-d);
}

/* heighlight. */
#write mark {
    background-color: #ebffeb;
    border-radius: 2px;
    padding: 2px 4px;
    margin: 0 2px;
    color: #222;
    font-weight: 500;
}

#write del {
    padding: 1px 2px;
}

.cm-s-inner .cm-link,
.cm-s-inner.cm-link {
    color: var(--theme-vim-bl);
}

.cm-s-inner .cm-string {
    color: var(--theme-vim-bl);
}

.md-task-list-item > input {
    margin-left: -1.3em;
}

@media screen and (min-width: 914px) {
    /*body {
        width: 854px;
        margin: 0 auto;
    }*/
}

@media print {
    html {
        font-size: 13px;
    }

    table,
    pre {
        page-break-inside: avoid;
    }

    pre {
        word-wrap: break-word;
    }
}

#write pre.md-meta-block {
    padding: 1rem;
    font-size: 85%;
    line-height: 1.45;
    background-color: hsl(0, 0%, 3%);
    border: 0;
    border-radius: 3px;
    color: hsl(0, 0%, 53%);
    margin-top: 0 !important;
}

.mathjax-block > .code-tooltip {
    bottom: 0.375rem;
}

#write > h3.md-focus:before {
    left: -1.5625rem;
    top: 0.375rem;
}

#write > h4.md-focus:before {
    left: -1.5625rem;
    top: 0.285714286rem;
}

#write > h5.md-focus:before {
    left: -1.5625rem;
    top: 0.285714286rem;
}

#write > h6.md-focus:before {
    left: -1.5625rem;
    top: 0.285714286rem;
}

.md-image > .md-meta {
    border-radius: 3px;
    font-family: Consolas, 'Liberation Mono', Courier, monospace;
    padding: 2px 0px 0px 4px;
    font-size: 0.9em;
    color: inherit;
}

.md-tag {
    color: inherit;
}

.md-toc {
    margin-top: 20px;
    padding-bottom: 20px;
}

.sidebar-tabs {
    border-bottom: none;
}

#typora-quick-open {
    border: 1px solid #ddd;
    background-color: #f8f8f8;
}

#typora-quick-open-item {
    background-color: hsl(0, 0%, 2%);
    border-color: hsl(0, 0%, 0%) hsl(0, 0%, 10%) hsl(0, 0%, 10%) hsl(0, 0%, 7%);
    border-style: solid;
    border-width: 1px;
}

#md-notification:before {
    top: 10px;
}

/** focus mode */

.on-focus-mode blockquote {
    border-left-color: rgba(85, 85, 85, 0.12);
}

header,
.context-menu,
.megamenu-content,
footer {
    font-family: 'Segoe UI', 'Arial', sans-serif;
}

.file-node-content:hover .file-node-icon,
.file-node-content:hover .file-node-open-state {
    visibility: visible;
}

.mac-seamless-mode #typora-sidebar {
    background-color: hsl(0, 0%, 2%);
    background-color: var(--side-bar-bg-color);
}

.md-lang {
    color: var(--theme-vim-gn);
}

.html-for-mac .context-menu {
    --item-hover-bg-color: hsl(215, 92%, 5%);
}

#typora-sidebar {
    /* font-family: Roboto Mono, Source Sans Pro, Monaco, courier, monospace !important; */
    font-family: Helvetica, Arial !important;
    font-weight: bold;
}

.file-list-item-summary {
    font-family: Helvetica, Arial !important;
    font-weight: 400;
}

.file-list-item {
    border-bottom: 0.15rem solid hsl(0, 0%, 18%);
}

.file-list-item.active {
    background: hsl(0, 0%, 15%) !important;
}

.file-node-background {
    height: 29px;
}

#toc-dropmenu {
    background: hsl(0, 0%, 18%) !important;
    /* font-family: Roboto Mono, Source Sans Pro, Monaco, courier, monospace !important; */
    font-weight: bold;
}

#toc-content {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

#toc-content a:hover {
    text-decoration: none;
}

.outline-item {
    /* transition: color 150ms, background-color 150ms; */
    transition: color 150ms;
}

.outline-item:hover {
    background-color: rgba(0, 0, 0, 0.5);
    color: var(--theme-vim-gn);
}

.sidebar-footer {
    border-top: 2px solid hsl(0, 0%, 15%) !important;
}

.footer-item:hover,
.sidebar-footer-item:hover {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.file-tree-node.active > .file-node-background {
    background-color: hsl(0, 0%, 15%) !important;
}

.file-node-content:hover {
    color: #fff;
}

html {
    background: #1f1f1f !important;
}

.outline-title-wrapper {
    display: none;
}

.dropdown-menu .divider {
    display: none;
    height: 2px;
    background-color: hsl(0, 0%, 13%);
}

.dropdown-menu > li > a {
    color: #fff;
}

.autoComplt-hint {
    color: var(--theme-vim-gn) !important;
    /* border-color: transparent !important */
}

.auto-suggest-container {
    color: var(--theme-vim-gn) !important;
    font-family: Roboto Mono, Source Sans Pro, Monaco, courier, monospace !important;
    font-weight: bold !important;
    border-color: var(--theme-vim-gn) !important;
    border-radius: 8px !important;
    border-width: 2px !important;
    margin-top: 5px;
    overflow: hidden !important;
    box-shadow: 0 0 1rem hsla(153, 47%, 49%, 0.3);
}

/* .auto-suggest-container li { */
/* transition: all 150ms; */
/* text-align: center !important; */
/* } */

.auto-suggest-container li:hover {
    color: #fff !important;
    background-color: var(--theme-vim-gn) !important;
    /* text-align: right !important; */
}

/* windows */
/* .modal-dialog { */
/* color: #000; */
/* } */

.typora-sourceview-on #toggle-sourceview-btn {
    background-color: var(--theme-vim-gn);
}

/* cursor */
.CodeMirror.cm-s-typora-default div.CodeMirror-cursor {
    border-left: 5px solid var(--theme-vim-gn);
}

.CodeMirror div.CodeMirror-cursor {
    border-left: 5px solid var(--theme-vim-gn);
    z-index: 3;
}

.form-control {
    background-color: var(--bg-trans-d);
    border-color: var(--bg-color);
}

.modal-header,
.modal-footer {
    border-color: var(--bg-trans-l);
    border-width: 2px;
}

.btn:hover {
    background-color: var(--theme-vim-gn);
}

.md-rawblock-on-edit > .md-rawblock-tooltip,
.md-rawblock:hover > .md-rawblock-container,
.md-rawblock:hover > .md-rawblock-tooltip {
    transition: background 0.5s linear;
    background-color: var(--fence-bg) !important;
    display: block;
}

.md-rawblock-control:not(.md-rawblock-tooltip) {
    background-color: var(--fence-bg) !important;
}

/* windows */

:root {
    --text-color: var(--fg-color);
    --btn-border-color: hsla(0, 0%, 100%, 0.1);
    --item-hover-bg-color: var(--select-text-bg-color);
}

.megamenu-menu-header {
    border-color: var(--btn-border-color);
}

.megamenu-opened header {
    background-image: none;
}

.megamenu-menu {
    background-color: var(--side-bar-bg-color);
}

.megamenu-content {
    background: var(--bg-color);
}

.modal-content {
    border-color: var(--btn-border-color);
}

.long-btn {
    border-color: var(--btn-border-color);
}

#recent-file-panel tbody tr:nth-child(2n-1) {
    background-color: transparent;
}

footer.ty-footer {
    border-top: 1px solid var(--table-bg);
}

#recent-file-panel-action-btn {
    background-color: transparent;
}

/* improvement */

.dropdown-menu {
    box-shadow: 0 0 0 0 transparent;
    -webkit-box-shadow: 0 0 0 0 transparent;
}

p,
blockquote,
ul,
ol,
dl,
table {
    margin: 0.4em 0;
    /*     margin: 0.8rem 0 0 0 ; */
}
:root {
    --code-theme-rd: #ec5f67;
    --code-theme-or: #f99157;
    --code-theme-yl: #fac863;
    --code-theme-gn: #99c794;
    --code-theme-cy: #5fb3b3;
    --code-theme-bl: #6699cc;
    --code-theme-vt: #c594c5;
    --code-theme-bn: #ab7967;
    --code-theme-wt: #d8dee9;
    --code-theme-rd-br: #fc929e;
    --code-theme-or-br: #ff8b50;
    --code-theme-yl-br: #f8b94e;
    --code-theme-gn-br: #8ec089;
    --code-theme-cy-br: #88c6be;
    --code-theme-bl-br: #79b6f2;
    --code-theme-vt-br: #c5a5c5;
    --code-theme-bn-br: #5b5b5b;
    --code-theme-wt-br: #e4e8f0;
    --code-theme-gy: #b2b2b2;
}

#write .md-fences {
    color: #efefef !important;
}

/* code color */
.cm-s-inner .cm-keyword {
    color: var(--code-theme-vt-br);
}

.cm-s-inner .cm-atom,
.cm-s-inner.cm-atom {
    color: var(--code-theme-or);
}

.cm-s-inner .cm-number {
    color: var(--code-theme-rd-br);
}

.cm-s-inner .cm-def {
    color: var(--code-theme-bl-br);
}

.cm-s-inner .cm-variable {
    color: #ffffff;
}

.cm-s-inner .cm-variable-2 {
    color: var(--code-theme-vt-br);
}

.cm-s-inner .cm-variable-3 {
    color: #ffffff;
}

.cm-s-inner .cm-string {
    color: var(--code-theme-gn);
}

.cm-s-inner .cm-property {
    color: var(--code-theme-yl);
}

.cm-s-inner .cm-operator {
    color: var(--code-theme-wt);
}

.cm-s-inner .cm-comment,
.cm-s-inner.cm-comment {
    color: var(--code-theme-gy);
}

.cm-s-inner .cm-string-2 {
    color: var(--code-theme-or);
}

.cm-s-inner .cm-meta {
    color: var(--code-theme-vt-br);
}

.cm-s-inner .cm-qualifier {
    color: var(--code-theme-vt-br);
}

.cm-s-inner .cm-builtin {
    color: var(--code-theme-or);
}

.cm-s-inner .cm-bracket {
    color: var(--code-theme-cy-br);
}

.cm-s-inner .cm-tag {
    color: var(--code-theme-rd-br);
}

.cm-s-inner .cm-attribute {
    color: var(--code-theme-vt-br);
}

.cm-s-inner .cm-header,
.cm-s-inner.cm-header {
    color: var(--code-theme-vt-br);
}

.cm-s-inner .cm-quote,
.cm-s-inner.cm-quote {
    color: #7fcc7f;
}

.cm-s-inner .cm-hr,
.cm-s-inner.cm-hr {
    color: hsl(0, 0%, 60%);
}

.cm-s-inner .cm-link,
.cm-s-inner.cm-link {
    color: var(--code-theme-or-br);
}

.cm-negative {
    color: var(--code-theme-rd-br);
}

.cm-positive {
    color: var(--code-theme-gn-br);
}

.cm-header,
.cm-strong {
    font-weight: 700;
}

.cm-error {
    color: #ff7f7f;
}

.cm-invalidchar {
    color: #ff7f7f;
}

.cm-constant {
    color: #42b983;
}

.cm-defined {
    color: #dac37f;
}

div.CodeMirror span.CodeMirror-matchingbracket {
    color: #7fff7f;
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
    color: #ff9090;
}
